// 内容区背景及左上角标题公共样式
.contentBack {
    width: 97%;
    height: 87%;
    background-image: url('../../assets/statistics/statistics.png');
    background-size: 100% 99%;
    margin: 0 auto;
    display: flex;
    flex-direction: column;

    position: relative;

    &>.topBox {
        position: absolute;
        color: white;
        font-size: 18px;
        left: 0%;
        top: 2.7%;
        font-weight: 500;
        width: 25%;
        display: flex;



        &>.topTitle {
            width: 50%;
            text-align: center;
            cursor: pointer;
            font-size: 17px;
        }

        &>.show {
            width: 50%;
            height: 100%;
            // background-color: red;
            text-align: center;
            background-image: url('../../assets/statistics/topShow.png');
            background-repeat: no-repeat;
            background-size: 41%;
            background-position-x: 32%;
            background-position-y: 63%;
        }
    }

    &>.entity {
        width: 237px;
        height: 7%;
        background-image: url("../../assets/businessEntity/busTastic.png");
        display: flex;
        flex-direction: column;
        justify-content: space-evenly;
        align-items: center;
        color: white;
        margin: 4% 0% 1% 2%;

        background-size: 100% 100%;
        text-indent: 3.5rem;

        &>span {
            &:first-child {
                font-size: 12px;
            }

            &:last-child {
                font-size: 16px;
                font-weight: bold;

                &>i {
                    font-weight: lighter;
                    font-size: 12px;
                    color: #55abd9;
                }
            }
        }
    }

    &>.listBox {
        width: 95%;
        height: 59%;
        display: flex;
        flex-direction: column;
        margin: 20px auto;

        table {
            text-align: left;
            text-indent: 1em;
            border-collapse: collapse;
            color: #B0BACD;
            line-height: 40px;
            font-size: 12px;

            th {
                background-color: #1D3A70;
                border: 1px solid #1b3467;
            }

            tr {
                border-bottom: 2px solid #1D3A70;

                td {
                    width: 20%;
                }
            }

            &>.noShowData {
                display: none;
            }



            &>.emptyData {

                border-bottom: none;

            }

            :global {
                .ant-empty-description {
                    color: #C7CAD4;
                }
            }

        }

        :global {
            .ant-input {
                border: 1px solid #3269D7;
                border-radius: 0;
                background-color: #071526;
                color: #9CA1A8;
                line-height: 26px;
                margin-right: 5px;
            }

            .ant-input::placeholder {
                color: #ffffff;
            }

            .ant-btn-primary {
                background-image: linear-gradient(to right, #32559C, #0E2247);
                border-radius: 0;
                height: 31px;
                box-shadow: none;
                border: 1px solid #1890FF;
            }
        }
    }

    &>.selection {
        display: flex;
        color: #7A9EE2;
        font-size: 13px;
        justify-content: space-evenly;
        width: 96%;
        margin: 0 auto;

        &>ul {
            width: 23%;

            &:last-child {
                width: 5%;
                display: flex;
                justify-content: center;
                align-items: center;

                :global {

                    .ant-btn-primary {
                        background-image: linear-gradient(to right, #32559C, #0E2247);
                        border-radius: 0;
                        height: 35px;
                        box-shadow: none;
                        border: 1px solid #1890FF;
                    }
                }

                &>li {
                    height: 90%;
                    display: flex;
                    flex-direction: column;
                    justify-content: space-between;
                    align-items: center;
                    border: none;
                }
            }

            &>li {
                display: flex;
                flex-direction: column;

                &>span {
                    padding: 10px;
                    border: 1px solid #10244A;
                    border-bottom: none;
                    border-top-right-radius: 10px;
                    border-top-left-radius: 10px;
                }

                &>div {
                    display: flex;
                    padding: 10px 20px 10px;
                    align-items: center;
                    border: 1px solid #18315D;

                    :global {
                        .ant-dropdown-trigger {
                            flex-shrink: 0;
                            height: 26px;
                            border-right: 2px solid #152D56;
                            padding-right: 10px;
                            margin-right: 10px;
                            text-indent: -0.6rem;
                            color: #E6E8EC;

                            .ant-space-item {
                                margin-right: 10px;
                            }


                        }

                        .ant-picker-input {
                            color: #E6E8EC !important;

                            input {
                                color: #E6E8EC !important;

                                &::placeholder {
                                    background-color: #0F2043;
                                    color: #E6E8EC;
                                    border: none;
                                    outline: none;
                                }

                                &::focus {
                                    color: #E6E8EC;
                                }
                            }

                        }

                        .ant-picker-separator {
                            color: rgb(255 255 255);
                        }


                        .ant-input {
                            background-color: #0F2043;
                            border: none;
                            color: #E6E8EC;
                            outline: none;

                            &::placeholder {
                                background-color: #0F2043;
                                color: #E6E8EC;
                                border: none;
                            }




                        }


                        .ant-input:placeholder-shown {
                            background-color: #0F2043;
                            border: none;
                        }

                        .ant-space-vertical {
                            width: 100%;


                            .ant-space-item {
                                width: 100%;

                                .ant-picker {
                                    width: 100%;


                                }
                            }

                        }

                    }
                }

                &:nth-child(3) {
                    :glabel {
                        &>.ant-space {
                            width: 100%;

                            &>.ant-space-item {
                                &>.ant-picker-range {
                                    width: 100%;

                                }
                            }
                        }
                    }
                }






            }
        }


    }



    &>.pagActive {
        width: 93%;
        display: flex;
        justify-content: flex-end;

        :global {
            .ant-pagination {
                color: white;

                .ant-pagination-item {
                    a {
                        color: rgb(55, 140, 252);
                    }
                }

                .ant-pagination-item-ellipsis {
                    color: rgb(55, 140, 252);
                }

                .ant-pagination-prev {
                    a {
                        color: rgb(55, 140, 252);
                    }

                }

                .ant-pagination-next {
                    a {
                        color: rgb(55, 140, 252);
                    }

                }
            }
        }
    }
}

:global {
    .ant-dropdown {
        .ant-dropdown-menu {
            height: 200px !important;
            overflow: auto !important;
        }
    }

}